<template>
	<view style="width: 100%;height: 100%;">
		<view v-if="global.BACKEND_URL=='https://jyjc.bj-cae.com:58001'" class="login">
			<image src="../../static/images/dly.png" style="width: 100%;height: 100vh;" mode="aspectFill"></image>
		</view>
		<view class="login" v-else>
			<view class="content">
				<view class="logo">
					<text style="font-size: 46rpx;">博维经营决策平台</text>
					<!-- <image src="./img/logo.png" mode="widthFix"></image> -->
				</view>
				<view class="login-form">
					<view style="margin-bottom: 50rpx;position: relative;">
						<u-icon name="account-fill" style="position: absolute;top: 16rpx;left: 10rpx;" size="46rpx"
							color="#FFFFFF"></u-icon>
						<u-input :height="80" v-model="form.username" placeholder="请输入用户名" :border="true" />
					</view>
					<view style="margin-bottom: 150rpx;position: relative;">
						<u-icon name="lock-fill" style="position: absolute;top: 16rpx;left: 10rpx;" size="46rpx"
							color="#FFFFFF"></u-icon>
						<u-input :height="80" color="#fff" style="color: #fff;" v-model="form.password"
							placeholder="请输入密码" type="password" :border="true" :password-icon="true" />
					</view>
					<view @click="submitLogin" class="btn">
						<text>登录</text>
					</view>
					<!-- <view class="forgot-pwd"><text>忘记密码？</text></view> -->
				</view>

				<!-- <view class="login-third">
					<view class="text">
						<image src="./img/icon_line.png" mode="widthFix"></image>
					</view>
					<view class="flex">
						<image src="./img/icon_weibo.png" mode="widthFix"></image>
						<image src="./img/icon_wechat.png" mode="widthFix"></image>
						<image src="./img/icon_qq.png" mode="widthFix"></image>
					</view>
				</view> -->
			</view>

		</view>
	</view>
</template>

<script>
	import md5 from 'js-md5'
	import global from '@/plugins/global'
	export default {
		data() {
			return {
				global:global,
				form: {
					username: '',
					password: ''
				},
				timerInterval: null,
				uniPlatform: 'mp-lark'
			}
		},
		onLoad() {
			// uni.removeStorageSync('refreshToken')
			// uni.removeStorageSync('token')
			let that = this;
			this.form.username = uni.getStorageSync('username')
			this.form.password = uni.getStorageSync('password')
			this.timerInterval && clearInterval(this.timerInterval)
			this.uniPlatform = uni.getSystemInfoSync().uniPlatform;
			if ((this.uniPlatform == 'mp-toutiao' || this.uniPlatform == 'mp-lark')&&global.BACKEND_URL=='https://jyjc.bj-cae.com:58001') {
				uni.$on('login', function(data) {
					uni.switchTab({
						url: '../index/index'
					})
				})
				setTimeout(() => {
					if(getApp().globalData.isFirstLogin){
						return false;
					}
					let times = Number(uni.getStorageSync('refreshExp'))*100
					let nowTime = new Date().getTime(); 
					if(uni.getStorageSync('refreshToken')&&times>nowTime){
						that.$request(that.$api['account/getToken'], {
							refresh_token: uni.getStorageSync('refreshToken'),
							grant_type: 'refresh_token',
							clientIP:getApp().globalData.clientIP,
						}, data => {
							if (getApp().globalData.isLogin) {
								getApp().globalData.isFirstLogin = false;
								uni.setStorageSync('token', data.token)
								uni.setStorageSync('refreshExp', data.refreshExp)
								uni.setStorageSync('refreshToken', data.refreshToken)
								uni.switchTab({
									url: '../index/index'
								})
							}
						})
					}else{
						that.login()
					}
				}, 1000)
			}

		},
		onShow() {
			// uni.hideTabBar({
			// 	animation:true
			// })
		},
		methods: {
		 async getUserToken(code){
				let that = this;

				tt.getUserInfo({
				    success(res) {
				      that.$request(that.$api['account/getToken'], {
				      		code: code,
				      		vendor: 'FeiShu',
				      		grant_type: 'mini_app',
							displayName:res.userInfo.displayName,
							clientIP:getApp().globalData.clientIP,
				      	}, data => {
				      		uni.hideLoading()
							getApp().globalData.isFirstLogin = false;
				      		uni.setStorageSync('token', data.token)
				      		uni.setStorageSync('refreshExp', data.refreshExp)
				      		uni.setStorageSync('refreshToken', data.refreshToken)
				      		that.$request(that.$api['user/getUsers'], {}, row => {
				      			getApp().globalData.userLoginId = row.id;
				      			getApp().globalData.account = row.account
				      			getApp().globalData.realName = row.realName
				      			getApp().globalData.organizationId = row.organizationId
				      			getApp().globalData.organizationName = row
				      				.organizationName
				      			getApp().globalData.isLogin = true;
				      		})
				      		uni.$emit('login', data.account);
				      	}, err => {
				      		uni.hideLoading()
				      	})
				      
				    },
				    fail(res) {
					  that.$request(that.$api['account/getToken'], {
					  		code: code,
					  		vendor: 'FeiShu',
					  		grant_type: 'mini_app',
							displayName:'',
							clientIP:getApp().globalData.clientIP,
					  	}, data => {
					  		uni.hideLoading()
					  		uni.setStorageSync('token', data.token)
					  		uni.setStorageSync('refreshToken', data.refreshToken)
					  		that.$request(that.$api['user/getUsers'], {}, row => {
					  			getApp().globalData.userLoginId = row.id;
					  			getApp().globalData.account = row.account
					  			getApp().globalData.realName = row.realName
					  			getApp().globalData.organizationId = row.organizationId
					  			getApp().globalData.organizationName = row
					  				.organizationName
					  			getApp().globalData.isLogin = true;
					  		})
					  		uni.switchTab({
					  			url: '../index/index'
					  		})
					  	}, err => {
					  		uni.hideLoading()
					  	})
				    }
				});
				},
			login() {
				setTimeout(() => {
					let that = this
					  tt.login({
					    success: (res) => {
					      that.code = res.code
					      that.getUserToken(res.code)
					    },
					    fail: (error) => {
					      // 登录失败，返回相应的errno和errString
					      const { errno, errString } = error;
					    },
					  });
				}, 1000)
			},
			refreshToken() {
				let that = this;
				if (!uni.getStorageSync('refreshToken')) {
					return false;
				}
				that.$request(that.$api['account/getToken'], {
					refresh_token: uni.getStorageSync('refreshToken'),
					grant_type: 'refresh_token',
					clientIP:getApp().globalData.clientIP,
				}, data => {
					console.log('refresh_token', data);
					uni.setStorageSync('token', data.token)
					if(data.refreshToken){
						uni.setStorageSync('refreshToken', data.refreshToken)
					}
				})
			},
			submitLogin() {
				if (!this.form.username || !this.form.password) {
					uni.showToast({
						icon: 'none',
						title: '请输入手机号和密码'
					})
					return false;
				}

				let that = this;
				that.$request(that.$api['account/getToken'], {
					username: this.form.username,
					password: md5(this.form.password),
					grant_type: 'password',
					fromPage: 'noDesktop',
					clientIP:getApp().globalData.clientIP,
				}, data => {
					uni.hideLoading()
					uni.setStorageSync('username', this.form.username)
					uni.setStorageSync('password', this.form.password)
					uni.setStorageSync('token', data.token)
					uni.setStorageSync('refreshToken', data.refreshToken)
					that.$request(that.$api['user/getUsers'], {}, row => {
						getApp().globalData.userLoginId = row.id;
						getApp().globalData.account = row.account
						getApp().globalData.realName = row.realName
						getApp().globalData.organizationId = row.organizationId
						getApp().globalData.organizationName = row.organizationName
						getApp().globalData.isLogin = true;
						getApp().globalData.avatar = row.avatar;
					})
					// uni.$emit('login', data.account);
					// that.timerInterval = setInterval(() => {
					// 	this.refreshToken()
					// }, 360000)
					uni.switchTab({
						url: '../index/index'
					})
					uni.showTabBar({
						animation: true
					})
				}, err => {
					uni.hideLoading()
					// uni.showToast({
					// 	title: '登录出错' + JSON.stringify(err)
					// })
				})
			}
		}
	}
</script>

<style lang="less" scoped>
	/deep/.u-input__input {
		color: #fff !important;
		padding-left: 60rpx;
	}

	.login {
		background-image: url('');
		background-size: cover;
		height: 100vh;
		width: 100%;
	}

	.content {
		position: absolute;
		top: 0;
		width: 100%;
	}

	.logo {
		height: 20vh;
		text-align: center;
		margin: 96rpx auto 73rpx auto;
		line-height: 20vh;
	}

	.logo image {
		width: 50%;
	}

	.login-form {
		width: 630rpx;
		margin: auto;
	}

	.login-form .item {
		width: 630rpx;
		height: 84rpx;
		border-radius: 6rpx;
		margin-bottom: 33rpx;
		display: flex;
		justify-content: space-around;
		align-items: center;
	}

	.login-form input {
		color: #fff;
		height: 84rpx;
		line-height: 84rpx;
	}

	.login-form .item .icon {
		width: 36rpx;
		height: 40rpx;
	}

	.input-placeholder {
		color: #fff;
		line-height: 84rpx;
		height: 84rpx;
		margin: auto;
	}

	.login-form .btn {
		margin: 43rpx auto 22rpx auto;
		text-align: center;
		height: 84rpx;
		line-height: 84rpx;
		border-radius: 6rpx;
		background-color: #6ea0f8;
	}

	.forgot-pwd {
		text-align: right;
	}

	text {
		height: 30rpx;
		font-family: PingFang-SC-Regular;
		font-size: 32rpx;
		font-weight: bold;
		font-stretch: normal;
		line-height: 40rpx;
		letter-spacing: 3rpx;
		color: #ffffff;
	}
</style>